<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:c="http://java.sun.com/jsp/jstl/core"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:fn="http://java.sun.com/jsp/jstl/functions"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	xmlns:framework="http://java.sun.com/jsf/composite/components"
	template="/WEB-INF/template.xhtml">
	<ui:define name="content">
		<h:form id="dictionary_form">
			<div class="ui-g">
				<div class="ui-g-12">
					<p:dataTable id="dictionary_table" widgetVar="dictionary_table"
						value="#{viewScope.dictionaries}" var="element"
						rowKey="#{element.id}" selection="#{controller.selectedDicts}"
						sortBy="#{element.classifyId}" expandableRowGroups="true"
						emptyMessage="#{msg['framework']['noRecords']}">
						<f:facet name="header">
							<p:outputPanel style="text-align: left;">
								<div class="ui-inputgroup" style="display: inline;">
									<p:inputText id="globalFilter" placeholder="Enter Keyword"
										onkeyup="PF('dictionary_table').filter()" />
									<p:commandButton value="Search" icon="fa fa-search" />
								</div>
								<p:commandButton id="operationButton"
									value="#{msg['framework']['operation']}" type="button"
									icon="fa fa-chevron-down" />
								<p:tieredMenu overlay="true" trigger="operationButton"
									my="left top" at="left bottom">
									<p:submenu icon="fa fa-fw fa-plus"
										label="#{msg['framework']['add']}">
										<p:menuitem value="#{msg['dictionary']['addClassify']}"
											actionListener="#{controller.addClassify}"
											icon="fa fa-fw fa-plus"
											oncomplete="PF('classify_dialog').show()"
											update="classify_dialog_form" />
										<p:menuitem value="#{msg['dictionary']['addDictionary']}"
											actionListener="#{controller.add}" icon="fa fa-fw fa-plus"
											oncomplete="PF('dictionary_dialog').show()"
											update="dictionary_dialog_form" />
									</p:submenu>
									<p:menuitem value="#{msg['framework']['edit']}"
										actionListener="#{controller.edit}" icon="fa fa-fw fa-edit"
										oncomplete="PF('dictionary_dialog').show()"
										update="dictionary_dialog_form" />
									<p:separator />
									<p:menuitem value="#{msg['framework']['delete']}"
										actionListener="#{controller.delete}"
										icon="fa fa-fw fa-remove" update="dictionary_table">
										<p:confirm header="Confirmation" message="Are you sure?"
											icon="pi pi-exclamation-triangle" />
									</p:menuitem>
								</p:tieredMenu>
							</p:outputPanel>
						</f:facet>
						<p:headerRow>
							<p:column colspan="5">
								<div class="ui-inputgroup">
									<c:set var="classifyItem"
										value="#{viewScope.classifyMap.get(element.classifyId)}" />
									<h:outputText
										value="#{classifyItem.name}（#{classifyItem.code}）" />
									<p:commandButton action="#{controller.deleteClassify}"
										title="#{msg['framework']['delete']}" icon="fa fa-remove"
										styleClass="red-button">
										<f:setPropertyActionListener value="#{classifyItem}"
											target="#{viewScope.classify}" />
									</p:commandButton>
								</div>
							</p:column>
						</p:headerRow>
						<p:column selectionMode="multiple" style="width:16px;" />
						<p:column headerText="#{msg['dictionary']['name']}">
							<h:outputText value="#{element.name}" />
						</p:column>
						<p:column headerText="#{msg['dictionary']['code']}">
							<h:outputText value="#{element.code}" />
						</p:column>
						<p:column headerText="#{msg['dictionary']['value']}">
							<h:outputText value="#{element.value}" />
						</p:column>
						<p:column headerText="#{msg['dictionary']['remark']}">
							<h:outputText value="#{element.remark}" />
						</p:column>
					</p:dataTable>
				</div>
			</div>
		</h:form>
	</ui:define>
	<ui:define name="dialog">
		<h:form id="classify_dialog_form">
			<framework:entityDialog id="classify_dialog"
				widgetVar="classify_dialog" responsive="true"
				saveDisabled="#{viewScope.classify== null}"
				saveUpdate=":dictionary_form:dictionary_table"
				saveMethod="#{controller.saveClassfiy}"
				header="#{msg['framework']['add']}">
				<p:outputPanel id="content" styleClass="ui-fluid"
					rendered="#{viewScope.classify != null}">
					<p:panelGrid columns="2"
						columnClasses="ui-g-12 ui-md-3,ui-g-12 ui-md-9" layout="grid"
						styleClass="ui-panelgrid-blank form-group form-elements">
						<h:outputText value="#{msg['classify']['name']}" />
						<p:inputText value="#{viewScope.classify.name}" />
						<h:outputText value="#{msg['classify']['code']}" />
						<p:inputText value="#{viewScope.classify.code}" />
					</p:panelGrid>
				</p:outputPanel>
			</framework:entityDialog>
		</h:form>
		<h:form id="dictionary_dialog_form">
			<framework:entityDialog id="dictionary_dialog"
				widgetVar="dictionary_dialog" responsive="true"
				saveDisabled="#{viewScope.dictionary == null}"
				saveUpdate=":dictionary_form:dictionary_table"
				header="#{msg['framework']['add']}">
				<p:outputPanel id="content" styleClass="ui-fluid"
					rendered="#{viewScope.dictionary != null}">
					<p:panelGrid columns="2"
						columnClasses="ui-g-12 ui-md-3,ui-g-12 ui-md-9" layout="grid">
						<h:outputText value="#{msg['dictionary']['classify']}" />
						<p:selectOneMenu value="#{viewScope.dictionary.classifyId}">
							<f:selectItem itemLabel="${msg['framework']['select']}"
								itemValue="#{null}" />
							<f:selectItems value="#{viewScope.classifies}" var="classify"
								itemLabel="#{classify.name}" itemValue="#{classify.id}" />
						</p:selectOneMenu>
						<h:outputText value="#{msg['dictionary']['name']}" />
						<p:inputText value="#{viewScope.dictionary.name}" />
						<h:outputText value="#{msg['dictionary']['code']}" />
						<p:inputText value="#{viewScope.dictionary.code}" />
						<h:outputText value="#{msg['dictionary']['value']}" />
						<p:inputText value="#{viewScope.dictionary.value}" />
						<h:outputText value="#{msg['dictionary']['filter']}" />
						<p:inputText value="#{viewScope.dictionary.filter}" />
						<h:outputText value="#{msg['dictionary']['remark']}" />
						<p:inputTextarea value="#{viewScope.dictionary.remark}"
							autoResize="false" />
					</p:panelGrid>
				</p:outputPanel>
			</framework:entityDialog>
		</h:form>
	</ui:define>
</ui:composition>